import { Notification } from 'element-ui'
import { unreaUpdate } from '@/api/socket/index'
import store from '@/store'
import { isJSON } from '@/utils/isJson'
import { returnData } from '@/utils/dataType'
import Vue from 'vue'

export function NotificationFunc(params, time) {
	Notification.closeAll()
	setTimeout(() => {
		let msg = ''
		if (isJSON(params.msgBody.otherMap) && returnData(JSON.parse(params.msgBody.otherMap)) === 'Object') {
			msg = `
					<strong 
						${isCharCodeAt(params.msgBody.msgContent)}
						style="display:block;
						height:213px;display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 10;
						word-break:break-all;
						overflow: hidden;"
					>${params.msgBody.msgContent}</strong>
					<br/>
					<div class="globalTipsClick"><i class="el-icon-right"/>前往</div>
				`
		} else {
			msg = `<strong 
					${isCharCodeAt(params.msgBody.msgContent)}
					style="display:block;
					height:213px;display: -webkit-box;
					-webkit-box-orient: vertical;
					word-break:break-all;
					-webkit-line-clamp: 10;
					overflow: hidden;"
					>${params.msgBody.msgContent}</strong>
				`
		}
		globalTipsClick(params)
		Notification({
			title: params.msgBody.msgTitle,
			message: msg,
			type: 'warning',
			duration: process.env.NODE_ENV === 'production' ? time : 400000,
			position: 'bottom-right',
			customClass: 'globalTipsClass',
			showClose: true,
			dangerouslyUseHTMLString: true,
			onClose: () => {
				if (isJSON(params.msgBody.otherMap) && returnData(JSON.parse(params.msgBody.otherMap)) === 'Object') {
					document.getElementsByClassName('globalTipsClick')[0].removeEventListener('click', (ev) => { })
				}
			},
			onClick: () => {
				if (!isJSON(params.msgBody.otherMap)) {
					unreaUpdate(params).then(res => {
						if (res.status === 200) {
							store.dispatch('globalTips/getCounts')
							Notification.closeAll()
						}
					})
				}
			}
		})
		setTimeout(() => {
			if (document
				.getElementsByClassName('globalTipsClass')[0]
				.getElementsByTagName('h2')[0]) {
				const dom = document
					.getElementsByClassName('globalTipsClass')[0]
					.getElementsByTagName('h2')[0]
				if (dom.clientWidth < dom.scrollWidth) { dom.setAttribute('title', params.msgBody.msgTitle) }
			}
		})
	}, 1000)
}

function otherMapType(item) {
	if (isJSON(item.msgBody.otherMap)) {
		const obj = JSON.parse(item.msgBody.otherMap)
		if (returnData(obj) === 'Object') {
			if (obj.windowType === '2') { // 原窗口打开
				location.href = obj.linkUrl
			} else if (obj.windowType === '1') { // 新窗口打开
				window.open(obj.linkUrl, '_seft')
			}
		}
	}
}

// 绑定事件
function globalTipsClick(params) {
	Vue.nextTick(() => {
		if (isJSON(params.msgBody.otherMap) && returnData(JSON.parse(params.msgBody.otherMap)) === 'Object') {
			if (document.getElementsByClassName('globalTipsClick') && document.getElementsByClassName('globalTipsClick').length) {
				document.getElementsByClassName('globalTipsClick')[0].addEventListener('click', (ev) => {
					const e = e || window.event
					e.stopPropagation()
					e.preventDefault()
					unreaUpdate(params).then(res => {
						if (res.status === 200) {
							store.dispatch('globalTips/getCounts')
							Notification.closeAll()
							otherMapType(params)
						}
					})
				})
			}
		}
	})
}

// 判断是否需要提示框
function isCharCodeAt(msg) {
	if (!msg) {
		return ''
	}
	const list = [...msg]
	let lengthCodeAt = 0
	let isOverflow = ''
	list.forEach((item, key) => {
		if (lengthCodeAt < 340) {
			if (item.toString().charCodeAt(0) > 255) { // 中文字符
				lengthCodeAt += 2
			} else if (item.toString().charCodeAt(0) < 48 || item.toString().charCodeAt(0) > 57) { // 数字
				lengthCodeAt += 0.8
			} else {
				lengthCodeAt += 1
			}
		} else {
			isOverflow = `title="${msg}"`
		}
	})

	return isOverflow
}
